<template>
  <div class="blog_calendar">
    <Calendar
      v-on:choseDay="clickDay"
      v-on:changeMonth="changeDate" >
    </Calendar>
  </div>
</template>

<script>
  import Calendar from 'vue-calendar-component';
  export default {
    name: 'calendar',
    components:{
      Calendar
    },
    methods:{
      clickDay(data) {
        console.log(data); //选中某天
      },
      changeDate(data) {
        console.log(data); //左右点击切换月份
      }
    }
  }
</script>

<style scoped>
  /*-----日历--start--*/

  .blog_calendar {
    margin-top: 30px;
    height: 300px;
  }
  /*.blog_calendar {*/
  /*height: 250px;*/
  /*}*/



  /*------日历--end------*/
</style>
